<template>
	<view>
		<view class="kong_box">

		</view>
		<view class="btnbox">
			<view class="btnbox_tip" v-if="tip">注:{{tip}}</view>
			<view @click="handleBtn" class="btnbox_btn" :style="{'color':color,'backgroundColor':bgColor}">
				<view  style="margin-right: 10px;" v-if="icon">
					<u-icon :color="color" size="24" :name="icon"></u-icon>
				</view>
				<text>{{text}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "bottomButton",
		props: {
			text: {
				type: String,
				default: "提交"
			},
			bgColor: {
				type: String,
				default: "#2979ff"
			},
			color: {
				type: String,
				default: "#ffffff"
			},
			icon:{
				type: String,
				default: ""
			},
			tip:{
				type: String,
				default: ""
			}
		},
		data() {
			return {

			};
		},
		methods: {
			handleBtn() {
				this.$emit('click')
			},
		}
	}
</script>

<style lang="scss">
	.kong_box {
		height: 170rpx;
	}

	.btnbox {
		position: fixed;
		bottom: 0;
		left: 0;
		// height: 140rpx;
		width: 750rpx;
		box-sizing: border-box;
		padding:16rpx 24rpx 32rpx 24rpx;
		
		background-color: #fff;
		// display: flex;
		// align-items: center;
		// flex-direction: column;
		// justify-content: center;
		z-index: 9;
		&_btn {
			width: 700rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 80rpx;
			border-radius: 16rpx;
			margin-top: auto;
		}
		&_tip{
			color: red;
			font-size: 12px;
			text-align: left;
			width: 100%;
			padding-bottom: 10rpx;
		}

	}
</style>